import {useEffect,useState} from 'react'
import styles from "./index.module.scss";

interface IProps {
  time:number,
  onEnd:Function
}

export default function CountDown(props: IProps) {
  const { time,onEnd } = props
  const [count,setCount] = useState(time || 60)

  useEffect(()=>{
  const timeSet = setInterval(()=>{
      setCount((count)=>{
        if(count === 0){
          clearInterval(timeSet)
          onEnd && onEnd()
          return count
        }
        return count - 1;
      });
    },1000)
    // 返回值清除定时器
     return ()=>{
        clearInterval(timeSet)
      }
  },[time,onEnd])

  return (
    <div className={styles.countDown}>{count}</div>
    );
  }